<template>
	<div>
		<!-- 收藏界面 -->
		<card :header="{title:'收藏的话题'}">
			<group slot='content'>
				<cell v-for="(i,index) in collct_topics" :key="index" :title="i.title" is-link :link="'/topic/'+i.id">
					<span slot='icon'>
						<img :src="i.author.avatar_url" alt="" style="width: 30px;height: 30px;margin-right: 5px;">
					</span>
				</cell>
			</group>
		</card>
	</div>
</template>

<script>
	import {
		Group,
		Cell,
		Card
	} from 'vux'
	export default {
		props: ['loginname'],
		components: {
			Group,
			Cell,
			Card
		},
		data: function() {
			return {
				collct_topics: []
			}
		},
		//导航守卫
		beforeRouteEnter: function(to, from, next) {
			//进入路由之前，this不指代当前组件对象
			next(function(vm) {
				//获取用户收藏的主题信息
				vm.$http.get('/topic_collect/' + to.params.loginname).then(function(res) {
					vm.collct_topics = res.data.data;
				})
			})
		},
		//导航守卫改变时
		beforeRouteUpdate: function(to, from, next) {
			var app = this;
			//获取用户收藏的主题信息
			app.$http.get('/topic_collect/' + to.params.loginname).then(function(res) {
				app.collct_topics = res.data.data;
			});
			next();
		}
	}
</script>

<style>
</style>
